<!DOCTYPE HTML>
<html>
<head>
    <title>物料档案</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="../assets/css/dpl-min.css" rel="stylesheet" type="text/css" />
    <link href="../assets/css/bui-min.css" rel="stylesheet" type="text/css" />
    <link href="../assets/css/page-min.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="../assets/css/my-code.css">
    <link href="../assets/css/common-style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="../assets/css/materialFile.css">
    <script type="text/javascript" src="../assets/js/jquery-1.8.1.min.js"></script>
    <script type="text/javascript" src="../assets/js/bui-min.js"></script>
    <script type="text/javascript" src="../assets/js/config-min.js"></script>
    <script src="../assets/js/my.js"></script>
</head>
<body>
<div class="container">
    <ul class="head-nav">
        <li class="active">设备</li>
        <li>安装材料</li>
    </ul>
    <div class="search-mes">
        <div class="row">
            <div class="span5" style="margin-left: 0">
                <div class="panel">
                    <div class="panel-header" style="background: #eaf1f9">树列表</div>
                    <div id="t1">

                    </div>
                </div>

            </div>
            <div class="span23 relative" style="margin-left: 28px">
                <form action="" id="my-form">
                    <lable>
                        编码
                        <input type="text" style="width:140px">
                    </lable>
                    <lable style="margin-left: 10px">
                        型号规格
                        <input type="text" style="width:140px">
                    </lable>
                    <lable style="margin-left: 10px">
                        简称
                        <input type="text" style="width:140px">
                    </lable>
                    <button class="button-search">搜本类</button>
                    <button class="button-export">搜全局</button>
                    <div class="button-do" style="margin-left: 9px">操作</div>
                    <ul class="do_mes" style="display: none">
                        <li class="add_material">新增物料</li>
                        <li class="remove_material">移动物料</li>
                        <li class="del_material">删除物料</li>
                    </ul>
                </form>
                <div id="g1" style="margin-top: 10px"></div>
                <div class="row">
                    <div class="" style="width:100%">
                        <div id="bar">

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="content" class="hide">
        <div class="add_vendor">
            <span class="vendor_active">基本信息</span>
            <span>其他信息</span>
            <span>控制信息</span>
            <span>图片信息</span>
        </div>
        <div class="vendor_mes">
            <form class="form-horizontal" id="J_Forms">
                <div class="row">
                    <div class="control-group span10">
                        <label class="control-label"><s>*</s>物料编码：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">物料简称：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label"><s>*</s>物料名称：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">英文名：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">型号：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">规格：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">助记码：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">计量单位：</label>
                        <div class="controls">
                            <select class="input-normal">
                                <option>台</option>
                                <option>个</option>
                            </select>
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">生产国家：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">生产厂商：</label>
                        <div class="controls">
                            <select class="input-normal">
                                <option>华为</option>
                                <option>中心</option>
                                <option>诺西</option>
                                <option>贝尔</option>
                                <option>爱立信</option>
                            </select>
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">生产地点：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">适用范围：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span24">
                        <label class="control-label">物料描述：</label>
                        <div class="controls">
                            <div class="controls  control-row-auto" style="margin-left: 0">
                                <textarea class="input-normal" type="text"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="control-group span24">
                        <label class="control-label">物料属性：</label>
                        <div class="controls checkbox">
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">备件
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">自制
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">委外
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">外购
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">成套件
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">生产耗用
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="vendor_mes" style="display:none">
            <form class="form-horizontal" id="J_Forms">
                <div class="row">
                    <div class="control-group span10">
                        <label class="control-label">长(cm)：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">宽(cm)：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">高(cm)：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">净重：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">毛重：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">重量单位：</label>
                        <div class="controls">
                            <select class="input-normal">
                                <option>台</option>
                                <option>个</option>
                            </select>
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">包装规格：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">体积：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">体积单位：</label>
                        <div class="controls">
                            <select class="input-normal">
                                <option>华为</option>
                                <option>中心</option>
                                <option>诺西</option>
                                <option>贝尔</option>
                                <option>爱立信</option>
                            </select>
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">合格证号：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">质量要求：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="vendor_mes" style="display:none">
            <form class="form-horizontal" id="J_Forms">
                <div class="row">
                    <div class="control-group span10">
                        <label class="control-label">最高库存：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">最低库存：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">安全库存：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">积压标准：</label>
                        <div class="controls">
                            <input name="a" type="text" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                    <div class="control-group span10">
                        <label class="control-label">是否报警(低)：</label>
                        <div class="controls checkbox">
                            <input name="a" type="checkbox" data-rules="{required:true}" class="input-normal control-text">
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script src="http://g.alicdn.com/bui/seajs/2.3.0/sea.js"></script>
<script src="http://g.alicdn.com/bui/bui/1.1.21/config.js"></script>

<script type="text/javascript">
    BUI.use('common/page');
    BUI.use(['bui/tree','bui/data','bui/toolbar','bui/editor','bui/grid','bui/select'],function (Tree,Data,Toolbar,Editor,Grid,Select) {
        var NumerPBar = Toolbar.NumberPagingBar;
        var store = new Data.TreeStore({
            root : {
                id : '0',
                text : '设备',
                checked : false,
            },
            pidField : 'id',
            url : '../data/typeManaData.json',
            autoLoad : true
        });

        var tree = new Tree.TreeList({
            render : '#t1',
            showLine : true,
            height:400,
            store : store,
            checkType : 'all',
            showRoot : true
        });
        tree.render();
        var store = new Data.Store({
                url : '../data/materialFile.json',
                pageSize : 8,
                autoLoad:true, //自动加载数据
                params : { //配置初始请求的参数
                    a : 'a',
                    b : 'b',
                    c : 'c',
                    d : 'd'
                }
            }),
            columns = [
                {title : '编码',dataIndex :'a',width:200},
                {title : '简称',dataIndex :'b',width:100},
                {title : '型号',dataIndex :'c',width:200},
                {title : '规格',dataIndex :'d',width:100}
            ],
            grid = new Grid.Grid({
                render:'#g1',
                columns : columns,
                height:'auto',
                forceFit : true,
                loadMask: true,
                store: store,
                plugins: [BUI.Grid.Plugins.CheckSelection, BUI.Grid.Plugins.ColumnChecked, BUI.Grid.Plugins.AutoFit, BUI.Grid.Plugins.ColumnResize,Grid.Plugins.RowNumber], // 插件形式引入多选表格
            });
        grid.render();
        bar = new NumerPBar({
            render : '#bar',
            autoRender: true,
            elCls : 'pagination',
            store : store,
            prevText:'上一页',
            nextText:'上一页'
        });
        var firstLeaf = tree.findNode('1111'); //获取第一个叶子节点
        tree.setSelected(firstLeaf);
        tree.on('selectedchange',function(ev){
            var node = ev.item;
            if(node.leaf){ //只有点击叶子节点才能加载Grid
                //加载对应的数据，同时将分页回复到第一页
                store.load({id : node.id,start : 0});
            }
        });
        var editor = new Editor.DialogEditor({
            contentId:'content',
            width : 800,
            mask : true,
            title : '编辑物料',
            success : function(){
                this.accept();
            }
        });
        $(".button-do").click(function(){
            $(".do_mes").slideToggle();
        });
        $(".add_material").click(function(){
            $(".do_mes").slideUp();
            editor.show();
        });
    });
</script>
</html>